@namespace SwashbucklerDiary.Rcl.Components
@inherits DialogComponentBase

<MultiDisplay OnUpdate="UpdateDisplay">
    <MobileContent>
        <CustomMBottomSheet @ref="mBottomSheetExtension"
                            MyValue="Visible"
                            MyValueChanged="InternalVisibleChanged"
                            ContentClass="rounded-t-lg">
            <ActivatorContent>
                @ComputedActivatorContent
            </ActivatorContent>
            <ChildContent>
                <MCard Class="primary-background rounded-t-lg">
                    <div class="px-3 py-8" style="display: grid;grid-template-columns: repeat(5, 1fr);gap: 10px;">
                        @foreach (var item in DynamicListItems)
                        {
                            @if (item.Show)
                            {
                                <div class="d-flex flex-column align-center">
                                    <MButton Class="second-background mb-2"
                                             Width="56"
                                             Height="56"
                                             Icon="true"
                                             OnClick="@item.OnClick">
                                        <MIcon>@(item.Icon)</MIcon>
                                    </MButton>
                                    <div class="text-caption text-center">@(I18n.T(item.Text))</div>
                                </div>
                            }
                        }
                    </div>
                </MCard>
            </ChildContent>
        </CustomMBottomSheet>
    </MobileContent>
    <DesktopContent>
        <MMenu @ref="mMenu"
               Value="Visible"
               ValueChanged="InternalVisibleChanged"
               Rounded="@("lg")"
               Bottom="true"
               Right="true"
               OffsetX="MenuOffsetX"
               NudgeBottom="@MenuNudgeBottom"
               NudgeLeft="@MenuNudgeLeft"
               MinWidth="150"
               Transition="scroll-x-reverse-transition">
            <ActivatorContent>
                @ComputedActivatorContent
            </ActivatorContent>
            <ChildContent>
                <MList>
                    @foreach (var item in DynamicListItems)
                    {
                        @if (item.Show)
                        {
                            <MListItem @key="item"
                                       Dense="true"
                                       OnClick="item.OnClick">
                                <MListItemIcon Class="mr-3">
                                    <MIcon Size="20">
                                        @(item.Icon)
                                    </MIcon>
                                </MListItemIcon>
                                <MListItemContent Class="text-subtitle-2">
                                    @(I18n.T(item.Text))
                                </MListItemContent>
                            </MListItem>
                        }
                    }
                </MList>
            </ChildContent>
        </MMenu>
    </DesktopContent>
</MultiDisplay>